﻿<template>
    <div>
       
        <div :style="{padding: '24px', minHeight: '480px', background: '#fff'}">
            <el-form ref="queryParams" inline label-position="right" label-width="80px" v-model="queryParams">
             <!--    <el-form-item label="登录时间">
                    <el-date-picker type="date" @on-change="cbtime" v-model="others.btime" :placeholder="$t('开始时间')" style="width: 120px"></el-date-picker>
                    <el-date-picker type="date" @on-change="cetime" v-model="others.etime" :placeholder="$t('截止时间')" style="width: 120px"></el-date-picker>
                </el-form-item> -->
                <el-form-item>
                    <el-button v-on:click="search()" type="primary">{{$t('搜索')}}</el-button>
                    <el-button v-on:click="reset()">{{$t('重置')}}</el-button>
                </el-form-item>
           </el-form>
            <Table :loading="loading" :columns="columns" :data="userLoginLogs" border>
            </Table>
            <div style="margin: 10px;overflow: hidden">
                <div style="float: right;">
                    <Page :page-size="page.pageSize" show-total :total="page.total" :current="page.current" @on-change="changePage"></Page>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
export default {
    name: 'UserLoginLog',
    data() {
        return {
            loading: false,
            modalEdit: false,
            modalLoading: false,
            queryParams: {
                btime:'',
                etime:""
            },
            others: {   
                btime:'',
                etime:""
            },
            userLoginLog: {

            },
            page: {
                total: 0,
                current: 1,
                pageSize: 10
            },
            userLoginLogs: [

            ],
            rules: {},
            columns: [{
                    title: '登录IP',
                    key: 'ip',
                    width: 130,
                    align: 'center'
                }, {
                    title: '备注',
                    key: 'msg',
                    width: 180,
                    align: 'center'
                }, {
                    title: '状态',
                    key: 'result',
                    width: 130,
                    align: 'center',
                    render: (h, params) => {
                        var text = "";
                        if (params.row.result == 1) text = "成功";
                        else if (params.row.result == -1) text = "失败";
                        return h("div", [
                            h("span", { style: {} }, text)
                        ]);
                    }
                }, {
                    title: '时间',
                    key: 'createTime',

                    align: 'center',
                    render: (h, params) => {
                        var me = this;
                        return h("div", [
                            h("span", { style: {} }, me.long2datetime(params.row.createTime))
                        ]);
                    }
                }

            ]
        };
    },
    mounted: function() {
        this.getList();

    },
    methods: {
        cbtime: function(value) {
            this.queryParams.btime = value;
        },
        cetime: function(value) {
            this.queryParams.etime = value;
        },
        search: function() {
            this.page.current = 1;
            this.page.total = 0;
            this.getList();
        },
        reset: function() {
            this.queryParams = {};
            this.others={
                btime:"",
                etime:""
            }
            this.getList();
        },
        changePage(current) {
            this.page.current = current;
            this.getList();
        },
        getList: function() {
            var me = this;
            var params = me.queryParams;
            params.current = me.page.current;
            params.pageSize = me.page.pageSize;
            me.loading = true;
            me.$http.post("/loginlog/getlist.do", params).then(response => {
                var body = response;
                if (body.status == 0) {
                    me.page.total = body.obj.totalCount;
                    me.userLoginLogs = body.obj.list;

                }
                me.loading = false;
            }, response => {
                me.loading = false;
            });
        }
    }
}
</script>
<style scoped>
</style>